<template>
  <div>
    <!-- 上传图片 -->
    <upload-image :filelist="filelist" @set-data="upload_img" @remove-data="remove_img" />
  </div>
</template>

<script lang="ts" setup>
defineOptions({
  name: '上传图片示例',
})

//上传图片必备  开始

const filelist = reactive<any>([])
const form = reactive<any>({})

const upload_img = (res: any, field: any) => {
  if (field) {
    Object.assign(form[field], res)
  } else {
    Object.assign(filelist, res)
  }
}
const remove_img = (res: any, field: any) => {
  if (field) {
    for (let i = 0; i < form[field].length; i++) {
      if (form[field][i].id == res.id) {
        form[field].splice(i, 1)
      }
    }
    Object.assign(form[field], res)
  } else {
    for (let i = 0; i < filelist.length; i++) {
      if (filelist[i].id == res.id) {
        filelist.splice(i, 1)
      }
    }
    Object.assign(filelist, res)
  }
}
//上传图片必备   结束
</script>
